{include file="public/layout" /}
<body class="laytp-container">
<div id="search-form">

</div>
<div class="layui-card">
    <div class="layui-card-body">
        <table id="tabledata" lay-filter="tabledata"></table>
    </div>
</div>
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" onclick="reload()">
            刷新数据
        </button>
        <button class="layui-btn layui-btn-sm" onclick="add()">
            新增
        </button>
    </div>
</script>
<script type="text/html" id="handlebar">
    <div class="layui-clear-space">
        <a class="layui-btn layui-btn-xs" lay-event="edit">查看</a>
        <a class="layui-btn layui-btn-xs" lay-event="more">
            更多
            <i class="layui-icon layui-icon-down"></i>
        </a>
    </div>
</script>
<script>
    var tableIns
    var datawhere = {};
    layui.use(function () {
        var table = layui.table;
        var dropdown = layui.dropdown;
        var laydate = layui.laydate;
        var form = layui.form;

        // 创建渲染实例
        tableIns = table.render({
            elem: '#tabledata',
            url: '{:url("index")}', // 此处为静态模拟数据，实际使用时需换成真实接口
            where: datawhere,
            toolbar: '#toolbar',
            defaultToolbar: ['filter'],
            height: 'full-200', // 最大高度减去其他容器已占有的高度差
            css: [ // 重设当前表格样式
                '.layui-table-tool-temp{padding-right: 145px;}'
            ].join(''),
            cellMinWidth: 80,
            totalRow: true, // 开启合计行
            page: true,
            pagebar: '#test-pagebar', // 分页栏模板
            cols: [[
                {type: 'checkbox', fixed: 'left'},
                {field: 'id', fixed: 'left', width: 80, title: 'ID'},
                {field: 'name', width: 80, title: '名称', totalRowText: ''},
                {
                    fixed: 'right', title: '操作', width: 134, minWidth: 200, templet: function (d) {
                        var html = '';
                        html += '<a class="layui-btn layui-btn-xs" onclick="edit(' + d.id + ')">编辑</a>';
                        html += '<a class="layui-btn layui-btn-xs" onclick="del(' + d.id + ')">删除</a>';
                        return html;
                    }
                }
            ]],
            error: function (res, msg) {
                console.log(res, msg)
            }
        });


        laydate.render({
            elem: '.demo-table-search-date'
        });
        laydate.render({
            elem: '#laydate-rangeLinked',
            type: 'datetime',
            range: ['#table-search-date-start', '#table-search-date-end'],
            rangeLinked: true // 开启日期范围选择时的区间联动标注模式 ---  2.8+ 新增
        });
        // 搜索提交
        form.on('submit(demo-table-search)', function (data) {
            var field = data.field; // 获得表单字段
            var olddatawhere = datawhere
            datawhere = field
            datawhere.field = olddatawhere.field
            datawhere.order = olddatawhere.order
            datawhere.status = olddatawhere.status
            // 执行搜索重载
            table.reload('tabledata', {
                page: {
                    curr: 1 // 重新从第 1 页开始
                },
                where: datawhere // 搜索的字段
            });
            //layer.msg('搜索成功<br>此处为静态模拟数据，实际使用时换成真实接口即可');
            return false; // 阻止默认 form 跳转
        });
    });

    function add() {
        layer.open({
            title: '添加',
            type: 2,
            shadeClose: true,
            area: ['50%', '50%'],
            scrollbar: false,
            content: '{:url("edit")}'
        });
    }
    function edit(id) {
        layer.open({
            title: '编辑',
            type: 2,
            shadeClose: true,
            area: ['50%', '50%'],
            scrollbar: false,
            content: '/admin/GoodsLeixing/edit/id/'+id
        });
    }

    function reload() {
        layui.table.reload('tabledata', {
            where: datawhere,
            // scrollPos: 'fixed',  // 保持滚动条位置不变 - v2.7.3 新增
            // height: 2000, // 测试无效参数（即与数据无关的参数设置无效，此处以 height 设置无效为例）
            //url: '404',
            //page: {curr: 1, limit: 30} // 重新指向分页
        }, true);
    }

    function del(order_id) {
        if (order_id) {
            var ids = [order_id];
        } else {
            var checkStatus = layui.table.checkStatus('tabledata');
            var data = checkStatus.data;
            var ids = [];
            $.each(data, function (index, value) {
                //goods_ids.append(value.goods_id);
                ids.push(value.order_id);
            });
        }
        layer.confirm('确定要删除选择的数据' + ids + '吗？', function (index) {
            $.ajax({
                type: "POST",
                url: "{:url('del')}",
                data: {ids: ids},
                success: function (res) {
                    console.log(res);
                    if (res.status) {
                        layer.msg('提交成功');
                    } else {
                        layer.msg(res.msg);
                    }
                    layer.close(index);
                    tableIns.reload()
                }
            });
            layer.close(index);
            // 向服务端发送删除指令
        });
    }
</script>
</body>
</html>